<template>
  <el-table :border="true" :data="trafficList">
    <el-table-column prop="trafficNo" label="编号"/>
    <el-table-column prop="trafficName" label="名称"/>

    <el-table-column label="出发城市" v-slot="{row:{startCity}}">
      {{ cityToStr(startCity) }}
    </el-table-column>
    <el-table-column label="到达城市" v-slot="{row:{destCity}}">
      {{ cityToStr(destCity) }}
    </el-table-column>

    <el-table-column label="销售状态" v-slot="{row:{sellState}}">
      <el-tag class="ml-2" :type="sellStateTagType[sellState]">
        {{ sellStateStr[sellState] }}
      </el-tag>
    </el-table-column>
    <el-table-column label="管理状态" v-slot="{row:{adminState}}">
      <el-tag class="ml-2" :type="adminStateTagType[adminState]">
        {{ adminStateStr[adminState] }}
      </el-tag>
    </el-table-column>
    <el-table-column label="编辑状态" v-slot="{row:{editState}}">
      <el-tag class="ml-2" :type="editStateTagType[editState]">
        {{ editStateStr[editState] }}
      </el-tag>
    </el-table-column>
    <el-table-column label="查看详情" v-slot="{row:{trafficId,productType}}">
      <el-button type="primary"
                 @click="$router.push(`/admin/detail/${productTypeStr[productType]}/${trafficId}`)">更多操作
      </el-button>
    </el-table-column>
  </el-table>

</template>

<script setup>
import axios from "~/config/axios";
import {onMounted, ref} from "vue";
import {
  productTypeStr,
  sellStateStr,
  sellStateTagType,
  editStateStr,
  editStateTagType,
  adminStateStr,
  adminStateTagType, productTypeCode
} from "~/config/const.js"
import {cityToStr} from "~/config/utils.js"
import {useRoute} from "vue-router";

const thisProductTypeStr = useRoute().params.productTypeStr
const thisProductType = productTypeCode[thisProductTypeStr]
const trafficList = ref([]);
(async () => {
  trafficList.value = await axios.get(`/traffics/adminQuery/${thisProductType}`)
})();
onMounted(async () => {
})


</script>
<style scoped>
</style>